<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>zan-admin后台管理系统模板</title>
    <link rel="icon" href="favicon.ico" type="image/ico">
    <script src="static/js/checkie&edge.js"></script>
    <link href="static/css/bootstrap.min.css" rel="stylesheet">
    <link href="static/css/zan-admin.min.css" rel="stylesheet">
    <!-- 时间轴css -->
    <link href="lib/timeline.css" rel="stylesheet">
</head>

<body>
    <header class="zan-header">
        <span class="glyphicon glyphicon-menu-hamburger zan-sidebar-toggle" aria-hidden="true"></span>
        <div class="zan-header-center">
            <div class="zan-nav-item"><a href="index.html">首页</a></div>
            <div class="zan-nav-item"><a href="platform.html">平台</a></div>
            <div class="zan-nav-item"><a href="#">商城</a></div>
            <div class="zan-nav-item"><a href="#">运营</a></div>
        </div>
        <div class="zan-avatar-wrap">
            <div class="dropdown">
                <img class="zan-avatar" data-toggle="dropdown" src="static/images/avatar.jpg" alt="头像">
                <ul class="dropdown-menu dropdown-menu-right">
                    <li><a href="#">admin</a></li>
                    <li role="separator" class="divider"></li>
                    <li><a href="#">超级管理员</a></li>
                    <li role="separator" class="divider"></li>
                    <li><a href="#">通知 <span class="badge">10</span></a></li>
                    <li><a href="#">个人资料</a></li>
                    <li><a href="page_password.html">修改密码</a></li>
                    <li><a href="#">清空缓存</a></li>
                    <li role="separator" class="divider"></li>
                    <li><a href="page_login.html">退出登录</a></li>
                </ul>
            </div>
        </div>
    </header>
    <aside class="zan-aside">
        <div class="zan-brand">
            <a href="index.html">zan-admin后台管理系统</a>
        </div>
        <ul class="zan-sidebar">
            <li>
                <a href="index.html">
                    <span class="glyphicon glyphicon-home" aria-hidden="true"></span>后台首页
                </a>
            </li>
            <li>
                <a href="fonticon.html">
                    <span class="glyphicon glyphicon-text-size" aria-hidden="true"></span>字体图标
                </a>
            </li>
            <li class="haschildren">
                <a href="#">
                    <span class="glyphicon glyphicon-calendar" aria-hidden="true"></span>日期选择器
                </a>
                <ul class="zan-submenu">
                    <li><a href="plug_flatpickr.html">flatpickr</a></li>
                    <li><a href="plug_datetimepicker.html">datetimepicker</a></li>
                </ul>
            </li>
            <li class="haschildren">
                <a href="#">
                    <span class="glyphicon glyphicon-upload" aria-hidden="true"></span>文件上传
                </a>
                <ul class="zan-submenu">
                    <li><a href="plug_fileupload.html">fileupload</a></li>
                    <li><a href="plug_webuploader.html">webuploader</a></li>
                </ul>
            </li>
            <li class="haschildren">
                <a href="#">
                    <span class="glyphicon glyphicon-stats" aria-hidden="true"></span>图表插件
                </a>
                <ul class="zan-submenu">
                    <li><a href="plug_chart.html">chart</a></li>
                    <li><a href="plug_echarts.html">echarts</a></li>
                </ul>
            </li>

            <li class="haschildren">
                <a href="#">
                    <span class="glyphicon glyphicon-list-alt" aria-hidden="true"></span>富文本
                </a>
                <ul class="zan-submenu">
                    <li><a href="plug_tinymce.html">tinymce</a></li>
                    <li><a href="plug_editor.md.html">editor.md</a></li>
                    <li><a href="plug_ueditor.md.html">ueditor</a></li>
                </ul>
            </li>
            <li class="haschildren">
                <a href="#">
                    <span class="glyphicon glyphicon-saved" aria-hidden="true"></span>表单验证
                </a>
                <ul class="zan-submenu">
                    <li><a href="plug_formvalidation.html">formvalidation</a></li>
                    <li><a href="plug_jquery.validation.html">jquery.validation</a></li>
                </ul>
            </li>
            <li class="haschildren open">
                <a href="#">
                    <span class="glyphicon glyphicon-briefcase" aria-hidden="true"></span>其它插件
                </a>
                <ul class="zan-submenu">
                    <li><a href="plug_sweetalert.html">sweetalert</a></li>
                    <li><a href="plug_notify.html">notify</a></li>
                    <li><a href="plug_timeline.html">timeline</a></li>
                    <li><a href="plug_clipboard.html">clipboard</a></li>
                    <li><a href="plug_croppie.html">croppie</a></li>
                    <li><a href="plug_lightbox.html">lightbox</a></li>
                    <li><a href="plug_touchslider.html">touchslider</a></li>
                    <li><a href="plug_rocket.html">rocket</a></li>
                </ul>
            </li>
            <li class="haschildren">
                <a href="#">
                    <span class="glyphicon glyphicon-file" aria-hidden="true"></span>示例页面
                </a>
                <ul class="zan-submenu">
                    <li><a href="page_login.html" target="_blank">登录页面</a></li>
                    <li><a href="page_curd.html">CURD页面</a></li>
                    <li><a href="page_password.html">修改密码</a></li>
                    <li><a href="page_error.html" target="_blank">错误页面</a></li>
                </ul>
            </li>
        </ul>
    </aside>
    <!-- 面包屑导航 -->
    <div class="zan-breadcrumb">
        <ol class="breadcrumb">
            <li><a href="#">Home</a></li>
            <li><a href="#">Library</a></li>
            <li class="active">Data</li>
        </ol>
    </div>

    <main class="zan-main">
        <div class="container-fluid">
            <div class="panel panel-default zan-panel-default">
                <div class="panel-heading">自动左右排列</div>
                <div class="panel-body">
                    <div class="timeline">

                        <span class="timeline-label">
                            <span class="badge badge-primary">人类发展史</span>
                        </span>
                        <div class="timeline-item timeline-item-left">
                            <div class="timeline-point timeline-point-info">
                                <span class="glyphicon glyphicon-user" aria-hidden="true"></span>
                            </div>
                            <div class="timeline-event">
                                <div class="timeline-heading">
                                    <h4>早期人类</h4>
                                </div>
                                <div class="timeline-body">
                                    <p>
                                        发现于爪哇的莫佐克托人，原先被称为莫佐克托猿人，有人研究，认为可能属于能人,定年为约190万年前。
                                    </p>
                                </div>
                                <div class="timeline-footer">
                                    <p class="text-right">2020-08-07</p>
                                </div>
                            </div>
                        </div>
                        <div class="timeline-item timeline-item-right">
                            <div class="timeline-point timeline-point-info">
                                <span class="glyphicon glyphicon-user" aria-hidden="true"></span>
                            </div>
                            <div class="timeline-event">
                                <div class="timeline-heading">
                                    <h4>直立人</h4>
                                </div>
                                <div class="timeline-body">
                                    <p>
                                        在中国本土习惯上称之为“猿人”。生存年代距今约170万年或150万年前至二、三十万年前。
                                        地质时代属早更新世晚期到中更新世。其脑容量为775～1400毫升。
                                        最早发现的直立人是1891年荷兰军医E.杜布瓦在爪哇中部特里尼尔附近找到的一个头盖骨及一枚牙齿，
                                        次年又在同一地层发现一个大腿骨及一枚臼齿。头骨很厚，眉嵴突出，颅骨低平，具有猿的特征，
                                        但腿骨似人，适于直立行走，所以当时定名为“直立猿人”。
                                    </p>
                                </div>
                                <div class="timeline-footer">
                                    <p class="text-right">2020-08-07</p>
                                </div>
                            </div>
                        </div>
                        <div class="timeline-item timeline-item-right">
                            <div class="timeline-point timeline-point-info">
                                <span class="glyphicon glyphicon-user" aria-hidden="true"></span>
                            </div>
                            <div class="timeline-event">
                                <div class="timeline-heading">
                                    <h4>早期智人</h4>
                                </div>
                                <div class="timeline-body">
                                    <p>
                                        又称古人或尼安德特人。身体素质极为强壮，而且长寿，生活于距今约二、三十万年至四万年前。
                                        地质时代属更新世晚期。最早引起人们注意的是1856年在德国杜塞尔多夫城附近的尼安德特河谷一个洞穴中发现的一副人类骨架化石。
                                        定名为人属尼安德特种，后其学名改为智人尼安德特亚种。
                                    </p>
                                </div>
                                <div class="timeline-footer">
                                    <p class="text-right">2020-08-07</p>
                                </div>
                            </div>
                        </div>
                        <div class="timeline-item timeline-item-left">
                            <div class="timeline-point timeline-point-info">
                                <span class="glyphicon glyphicon-user" aria-hidden="true"></span>
                            </div>
                            <div class="timeline-event">
                                <div class="timeline-heading">
                                    <h4>晚期智人</h4>
                                </div>
                                <div class="timeline-body">
                                    <p>
                                        又称新人,出现于4万年前。其头骨前额升高，眉嵴几乎消失,颌部退缩,下颏明显，体质形态与现代人类已无多大差别。
                                        发现的化石分布于亚、非、欧、美、澳各大洲，说明此时除南极洲外，地球上各大洲均已有人居住。
                                    </p>
                                </div>
                                <div class="timeline-footer">
                                    <p class="text-right">2020-08-07</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>


            <div class="panel panel-default zan-panel-default">
                <div class="panel-heading">指定方向</div>
                <div class="panel-body">
                    <div class="timeline">

                        <span class="timeline-label">
                            <span class="badge badge-primary">人类发展史</span>
                        </span>
                        <div class="timeline-item timeline-item-left">
                            <div class="timeline-point timeline-point-info">
                                <span class="glyphicon glyphicon-user" aria-hidden="true"></span>
                            </div>
                            <div class="timeline-event">
                                <div class="timeline-heading">
                                    <h4>早期人类</h4>
                                </div>
                                <div class="timeline-body">
                                    <p>
                                        发现于爪哇的莫佐克托人，原先被称为莫佐克托猿人，有人研究，认为可能属于能人,定年为约190万年前。
                                    </p>
                                </div>
                                <div class="timeline-footer">
                                    <p class="text-right">2020-08-07</p>
                                </div>
                            </div>
                        </div>
                        <div class="timeline-item timeline-item-right">
                            <div class="timeline-point timeline-point-info">
                                <span class="glyphicon glyphicon-user" aria-hidden="true"></span>
                            </div>
                            <div class="timeline-event">
                                <div class="timeline-heading">
                                    <h4>直立人</h4>
                                </div>
                                <div class="timeline-body">
                                    <p>
                                        在中国本土习惯上称之为“猿人”。生存年代距今约170万年或150万年前至二、三十万年前。
                                        地质时代属早更新世晚期到中更新世。其脑容量为775～1400毫升。
                                        最早发现的直立人是1891年荷兰军医E.杜布瓦在爪哇中部特里尼尔附近找到的一个头盖骨及一枚牙齿，
                                        次年又在同一地层发现一个大腿骨及一枚臼齿。头骨很厚，眉嵴突出，颅骨低平，具有猿的特征，
                                        但腿骨似人，适于直立行走，所以当时定名为“直立猿人”。
                                    </p>
                                </div>
                                <div class="timeline-footer">
                                    <p class="text-right">2020-08-07</p>
                                </div>
                            </div>
                        </div>
                        <div class="timeline-item timeline-item-right">
                            <div class="timeline-point timeline-point-info">
                                <span class="glyphicon glyphicon-user" aria-hidden="true"></span>
                            </div>
                            <div class="timeline-event">
                                <div class="timeline-heading">
                                    <h4>早期智人</h4>
                                </div>
                                <div class="timeline-body">
                                    <p>
                                        又称古人或尼安德特人。身体素质极为强壮，而且长寿，生活于距今约二、三十万年至四万年前。
                                        地质时代属更新世晚期。最早引起人们注意的是1856年在德国杜塞尔多夫城附近的尼安德特河谷一个洞穴中发现的一副人类骨架化石。
                                        定名为人属尼安德特种，后其学名改为智人尼安德特亚种。
                                    </p>
                                </div>
                                <div class="timeline-footer">
                                    <p class="text-right">2020-08-07</p>
                                </div>
                            </div>
                        </div>
                        <div class="timeline-item timeline-item-left">
                            <div class="timeline-point timeline-point-info">
                                <span class="glyphicon glyphicon-user" aria-hidden="true"></span>
                            </div>
                            <div class="timeline-event">
                                <div class="timeline-heading">
                                    <h4>晚期智人</h4>
                                </div>
                                <div class="timeline-body">
                                    <p>
                                        又称新人,出现于4万年前。其头骨前额升高，眉嵴几乎消失,颌部退缩,下颏明显，体质形态与现代人类已无多大差别。
                                        发现的化石分布于亚、非、欧、美、澳各大洲，说明此时除南极洲外，地球上各大洲均已有人居住。
                                    </p>
                                </div>
                                <div class="timeline-footer">
                                    <p class="text-right">2020-08-07</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>


            <div class="panel panel-default zan-panel-default">
                <div class="panel-heading">单测排列</div>
                <div class="panel-body">
                    <div class="timeline timeline-single-column">

                        <span class="timeline-label">
                            <span class="badge badge-primary">足球发展史</span>
                        </span>



                        <div class="timeline-item timeline-item-arrow-sm">
                            <div class="timeline-point timeline-point-primary">
                                <span class=" glyphicon glyphicon-flag" aria-hidden="true"></span>
                            </div>
                            <div class="timeline-event">
                                <div class="timeline-heading">
                                    <h4>"蹴鞠"</h4>
                                </div>
                                <div class="timeline-body">
                                    <p>足球起源于中国东周时期的齐国，当时把足球名为“蹴鞠”,
                                        从东周时期到明朝,但到了满清，这项活动却走入了衰落。
                                        从此国足就不行了
                                    </p>
                                </div>
                                <div class="timeline-footer">
                                    <p class="text-right">2020-07-22</p>
                                </div>

                            </div>
                        </div>

                        <div class="timeline-item">
                            <div class="timeline-point">
                                <span class=" glyphicon glyphicon-flag" aria-hidden="true"></span>
                            </div>
                            <div class="timeline-event timeline-event-primary">
                                <div class="timeline-heading">
                                    <h4>现代足球</h4>
                                </div>
                                <div class="timeline-body">
                                    <p>现代足球起源地是在英格兰。传说在11世纪，英格兰与丹麦之间有过一场战争，
                                        战争结束后，英格兰人在清理战争废墟时发现一个丹麦入侵者的头骨，出于愤恨，
                                        他们便用脚去踢这个头骨，
                                        一群小孩见了便也来踢，不过他们发现头骨踢起来脚痛，
                                        于是用牛膀胱吹气来代替它——这就是现代足球的诞生。</p>
                                </div>
                                <div class="timeline-footer">
                                    <p class="text-right">2020-07-22</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </main>

    <script src="static/js/jquery.min.js"></script>
    <script src="static/js/bootstrap.min.js"></script>
    <script src="static/js/zan-admin.min.js"></script>
</body>

</html>